<template>
  <div>
    <van-card
      v-for="(item, index) in shopList"
      :key="item.id"
      :num="item.count"
      :price="item.price.toFixed(2)"
      desc="描述信息"
      :title="item.title"
      :thumb="item.img"
    >
      <template #footer>
        <!-- 时间修饰符 -->
        <van-button
          @click.stop="delCarItem(item,index)"
          type="info"
          size="mini"
          >－</van-button
        >
        <van-button @click.stop="addCarItem({ index })" type="info" size="mini"
          >＋</van-button
        >
      </template>
    </van-card>

    <van-submit-bar :price="3050" button-text="提交订单" @submit="onSubmit">
  <van-checkbox v-model="checked">全选</van-checkbox>
  <template #tip>
    你的收货地址不支持同城送, <span @click="onClickEditAddress">修改地址</span>
  </template>
</van-submit-bar>
  </div>
</template>

<script>
import { mapState, mapMutations } from "vuex";
export default {
  computed: {
    ...mapState({
      shopList: (state) => state.Car.shopList,
    }),
  },
  methods: {
    // 商品减少
    delCarItem(item,index) {
      if (item.count <= 1) {
        this.$dialog.confirm({
          title: "商品删除",
          message: "您确定要删除"+item.title+"吗？",
        })
          .then(() => {
            this.remCarItem({index,rem:true})
            this.$toast.success('删除成功');
          })
          .catch(() => {
            this.$toast('取消删除');
          });
      }else{
        this.remCarItem({index,rem:false})
      }
    },
    ...mapMutations({
      addCarItem: "Car/addCarItem",
      remCarItem:"Car/remCarItem"
    }),
  },
};
</script>

<style>
</style>